<template>
  <a-select
    :mode="mode"
    :default-value="defaultValue"
    :placeholder="record.options.placeholder"
    :disabled="disabled"
    style="width: 100%"
    @change="onChange"
  >
    <a-select-option v-for="(item, index) in companyEmployeeList" :key="index" :value="item.id">
      {{ item.name }}
    </a-select-option>
  </a-select>
</template>
<script>
import { mapGetters } from "vuex";
export default {
  name: "Station",
  props: ["record", "value"],
  data() {
    return {
      defaultValue: null,
      disabled: this.record.options.disabled
    };
  },
  computed: {
    ...mapGetters(["companyEmployeeList"]),
    mode: function() {
      return this.record.options.multiple ? "multiple" : "default";
    }
  },
  created() {
    const defaultValue = this.record.options.defaultValue;
    if (defaultValue && defaultValue.length > 0) {
      this.defaultValue = this.record.options.multiple ? defaultValue.split(",") : defaultValue;
    }
  },
  methods: {
    onChange(val) {
      const val_temp = this.record.options.multiple ? val.join(",") : val;
      this.$emit("input", val_temp);
      this.$emit("change", val_temp);
    }
  }
};
</script>
